<!DOCTYPE html>
<html><head>
<style type="text/css">
	td {
		background: lightblue;
		padding: 0.5em;
	}
	.grayscale {
		filter: Gray;
	}
	.blur {
		filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=1);
		position: relative;
		top: -1px;
		left: -1px;
	}
	.grayscaleBlur {
		filter: Gray progid:DXImageTransform.Microsoft.Blur(pixelradius=1);
		position: relative;
		top: -1px;
		left: -1px;
	}
</style>
</head><body>

<table><tr>
<td>normal</td>
<td class="grayscale">grayscale</td>
</tr><tr>
<td class="blur">blur</td>
<td class="grayscaleBlur">grayscaleBlur</td>
</tr></table>

<img src="barretr_Earth.png" style="width: 100px; height: 100px"/>
<img class="grayscale" src="barretr_Earth.png" style="width: 100px; height: 100px"/><br />
<img class="blur" src="barretr_Earth.png" style="width: 100px; height: 100px"/>
<img class="grayscaleBlur" src="barretr_Earth.png" style="width: 100px; height: 100px"/>

</body></html>
